<template>
    <div>
        <div class="tableHeader">
            <div class="tableHeaderTitle">文档列表</div>
            <div class="tableHeaderMenu">
                <el-button-group>
                    <el-button icon="el-icon-refresh" @click="refreshData" size="mini"></el-button>
                </el-button-group>
            </div>
        </div>

        <el-table ref="multipleTable" :data="auditDocumentData" tooltip-effect="dark" style="width: 100%">
            <el-table-column label="序号" type="index" width="80"></el-table-column>
            <el-table-column prop="ca_title" label="文档标题"></el-table-column>
            <el-table-column prop="cc_name" label="所属栏目"></el-table-column>
            <el-table-column prop="u_nickname" label="发布用户"></el-table-column>
            <el-table-column label="是否审核">
                <template slot-scope="scope">
                    <span v-if="scope.row.ca_is_audit == '0'" style="color:red">未审核</span>
                    <span v-if="scope.row.ca_is_audit == '1'" style="color:green">已审核</span>
                    <span v-if="scope.row.ca_is_audit == '2'" style="color:green">已驳回</span>
                </template>
            </el-table-column>
            <el-table-column prop="cl_type" label="发布时间">
                <template slot-scope="scope">
                    {{$common.dateFormat("YYYY/MM/dd hh:mm",scope.row.ca_create_time)}}
                </template>
            </el-table-column>
            <el-table-column label="操作" fixed="right" width="260">
                <template slot-scope="scope">
                    <el-button size="mini" v-if="scope.row.ca_is_audit == '1'" style="color:silver">审核</el-button>
                    <el-button size="mini" v-else @click="handleExamine(scope.$index, scope.row,1)">审核</el-button>
                    <el-button size="mini" v-if="scope.row.ca_is_audit == '2'" style="color:silver">驳回</el-button>
                    <el-button size="mini" v-else @click="handleExamine(scope.$index, scope.row,2)">驳回</el-button>
                </template>
            </el-table-column>
        </el-table>

        <!--分页-->
        <el-col :span="24">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="pagination.currentPage"
                    :page-sizes="[20,50,100,200]"
                    :page-size="pagination.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="pagination.dataLength"
            ></el-pagination>
        </el-col>
    </div>
</template>

<script>
    import {mapState, mapMutations} from 'vuex'

    export default {
        //数据源
        data() {
            return {}
        },
        //初始化函数
        mounted() {
            this.initData();
        },
        //计算属性
        computed: {
            ...mapState({
                auditDocumentData: state => state.AuditManagerDocumentListModule.auditDocumentData,
                pagination: state => state.AuditManagerDocumentListModule.pagination
            })
        },
        //组件方法
        methods: {
            initData() {
                this.$myLoading.startLoading()
                this.$http.getHttp(
                    this.$API.documentInfo + "/skip/" + this.pagination.skip + "/limit/" + this.pagination.pageSize,
                    rs => {
                        this.$store.commit('AuditManagerDocumentListModule/updateAuditDocumentData', rs.documentData)
                        this.$store.commit('AuditManagerDocumentListModule/updatePaginationDataLength', parseInt(rs.documentCount))
                        this.$myLoading.endLoading()
                    }
                )

            },
            refreshData() {
                this.pagination.skip = 0;
                this.initData()
            },

            handleExamine(index, item, type) {

                var text = "";

                var params = {
                    update_where: "ca_id",
                    ca_id: item.ca_id,
                };
                if (type == 1) {
                    params.ca_is_audit = 1;
                    text = "审核";
                } else {
                    params.ca_is_audit = 2;
                    text = "驳回";
                }

                this.$myPop.confirmBox("确认操作", "确定要" + text + "该文章吗？", () => {
                    this.$myLoading.startLoading();
                    this.$http.postHttp(
                        this.$API.cmsArticleUpdate,
                        params,
                        rs => {
                            this.$myLoading.endLoading();
                            this.$myPop.SuccessMessage();
                            this.initData()
                        }
                    )
                })
            },
            handleSizeChange(page) {
                this.pagination.pageSize = page;
                this.initData();
            },
            handleCurrentChange(page) {
                this.pagination.skip = (page - 1) * this.pagination.pageSize;
                this.pagination.currentPage = page;
                this.initData();

            }
        }
    }
</script>

<style lang="stylus" scoped>
    @import '~PUBLIC_CSS';
</style>